@import url("_config.less");

html, body {
	margin: 0; 
	padding: 0;
	background-color: lighten(@bg,30);
	font-family: Sans, Verdana;
	font-size:  0.8em;
}

@border_table: 1px solid black;

h1 {
	font-size: 1.5em
}
h2 {
	font-size: 1.3em
}
h3 {
	font-size: 1.1em
}
table {
	border-top: @border_table;
	border-left: @border_table;
	td , th {
		border-bottom : @border_table;
		border-right : @border_table;
		padding: 0.2em 0.5em;
	}
}

.wiki{

	p{
		text-align:justify;
		img{
			float: left;
			margin: 0 1em 1em 0
		}
	}
}

p {
	margin: 1em 0;
}

ul {
	margin: 0 0 0 2.5em
}

.borders {
    border: 0.2em solid lighten(@bg, 10);
}

.radius(@radius: 2em) {
	/**/
	-webkit-border-radius: @radius;
	-o-border-radius: @radius;
	-moz-border-radius: @radius;
	-ms-border-radius: @radius;
	border-radius: @radius;
	
	/**/
	padding: @border_padding;
}

.relative {
	position: relative
}

.shadow(@xoffset: 0, @yoffset: 0, @amount: 2em){
	-webkit-box-shadow: @xoffset @yoffset @amount/2 rgba(0,0,0,0.5) , @xoffset @yoffset @amount rgba(0,0,0,0.3);
	-moz-box-shadow: @xoffset @yoffset @amount/2 rgba(0,0,0,0.5) , @xoffset @yoffset @amount rgba(0,0,0,0.3);
	box-shadow: @xoffset @yoffset @amount/2 rgba(0,0,0,0.5) , @xoffset @yoffset @amount rgba(0,0,0,0.3);
}

.decorated {
	.shadow;
	.borders;
	.radius;
}


#wrapper {
    width: @site_size;
    margin: 0 auto;
    background: @bg;
}


#all-content{
    margin: 1em auto;
    background: lighten(@bg, 20);
    float: left; 
    padding: 1em;
	.decorated;
	.shadow(0.5em ,0.5em, 2em);
    width: 100% - @border_padding * 4;
    
}

#main-content {
	float: left;
	width: 68% - @border_padding;
	background-color: saturate(@bg, 10);
	.borders;
	.decorated;
}

#main-bloc-column {
	float: right;
	width: 30% - @border_padding * 4  ;
	.decorated;
}

#main-banner {
	background-color: darken(@bg, 20);
	color: @invert;
	margin-bottom: 1em;
	.decorated;
}

